<template>
	<view class="warp">
		<view class="uni-margin-wrap">
			<view class="uni-back-view">
				<view class="b-view-item">
					<view class="b-view-goods">
						<view class="b-view-goods-item">
							<view class="left site-item">
								<text class="text-red"></text>
								<text class="text1">运单号:</text>
								<text class="uni-input input text-input2">{{inputData.waybill_sn}}</text>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left site-item">
								<text class="text-red"></text>
								<text class="text1">起运站:</text>
								<text class="uni-input input text-input2">{{inputData.deliver_point_name}}</text>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left site-item">
								<text class="text-red">*</text>
								<text class="text1" style="width: 120rpx;">目的站:</text>
								<view class="bottom">
									<view class="left">
										<input type="text" class="uni-input input text-input2" style="padding: 15rpx 0rpx;" disabled="true" placeholder="请选择省市区" :value="inputData.to_address"
											@click="bindPickerChange(2)">
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-address">
						<view class="b-view-address-item">
							<view class="bottom">
								<view class="left">
									<text class="text1">发</text>
									<input class="uni-input input3" type="text" placeholder="姓名"
										v-model="inputData.send_username" />
								</view>
								<view class="right">
									<text class="text-red">*</text>
									<input class="uni-input input2" type="tel" placeholder="手机号"
										v-model="inputData.send_mobile" />
								</view>
							</view>
							<!-- <view class="bottom">
								<view style="width:100%">
									<input type="text" disabled="true" placeholder="请选择省市区" :value="inputData.send_city"
										@click="bindPickerChange(0)">
								</view>
							</view> -->
							<view class="b-view-address-item item-line"></view>
							<view class="bottom">
								<view style="width:100%">
									<input class="uni-input input2" type="text" placeholder="请输入详细地址" v-model="inputData.send_address">
								</view>
							</view>
						</view>
						<view class="b-view-address-item item-line"></view>
						<view class="b-view-address-item bottom-view">
							<view class="item-left">
								<view class="bottom">
									<view class="left">
										<text class="text2">收</text>
										<input class="uni-input input3" type="text" placeholder="姓名"
											v-model="inputData.take_username" />
									</view>
									<view class="right">
										<text class="text-red">*</text>
										<input class="uni-input input2" type="tel" placeholder="手机号"
											v-model="inputData.take_mobile" />
									</view>
								</view>
								<!-- <view class="bottom">
									<view style="width:100%">
										<input type="text" disabled="true" placeholder="请选择省市区"
											:value="inputData.take_city" @click="bindPickerChange(1)">
									</view>
								</view> -->
								<view class="b-view-address-item item-line"></view>
								<view class="bottom">
									<view style="width:100%">
										<input class="uni-input input2" type="text" placeholder="请输入详细地址" v-model="inputData.take_address">
									</view>
								</view>
							</view>
							<!-- <view class="item-right">
								<text>地址簿</text>
							</view> -->
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-item-header">
						<text class="text">货号：</text>
						<text class="uni-input input">{{inputData.goodsn}}</text>
						<view class="right" @click="addGoodClick()">
							<image class="image" :src="'/static/order/road_jia.png'"></image>
						</view>
					</view>
					<view class="b-view-goods" style="padding-top: 0rpx;" v-for="(goodsItem,index) in inputData.goods" :key="index">

						<view class="b-view-goods-item">
							<view class="left">
								<text class="text-red">*</text>
								<text class="text1">物品名称</text>
								<input class="uni-input input" type="text" placeholder="请输入物品名称"
									v-model="goodsItem.goods_name" />
							</view>
							<view class="right" @click="subGoodsClick(index)">
								<image class="image" :src="'/static/order/road_jian.png'"></image>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text-red">*</text>
								<text class="text1" style="width: 120rpx;">包装</text>
								<picker class="text2 text2-1" style="width: 100%;" @change="packPickerChange($event,index)" :value="index" :range="goodsPackList" range-key="name"> 
									<input class="uni-input text-input1 input text-input2" type="text" disabled placeholder="选择包装" v-model="goodsItem.goods_pack" />
								</picker>
							</view>
							<view class="right">
								<text class="text-red">*</text>
								<text class="text1">数量</text>
								<input class="uni-input input" type="number" placeholder="请输入数量"
									v-model="goodsItem.goods_nums" />
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text-red">*</text>
								<text class="text1">重量</text>
								<input class="uni-input input" type="digit" placeholder="请输入重量"
									v-model="goodsItem.total_weight" />
							</view>
							<view class="right">
								<text class="text-red">*</text>
								<text class="text1">体积</text>
								<input class="uni-input input" type="digit" placeholder="请输入体积"
									v-model="goodsItem.total_volume" />
							</view>
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-goods">
						<view class="b-view-goods-item">
							<view class="left site-item">
								<text class="text"></text>
								<uni-tooltip
									effect="dark" 
									placement="right-start"
									content="备注（服务项）：1、重量、体积计算费用哪个大按哪个标准计费。2、以上报价如有异形件、特大件、特重件货物类型需各加30%、20%、10%；" >
									<view class="tooltip-item">
										<text class="text1 freight-text">专线运费</text>
										<uni-icons custom-prefix="custom-icon" type="help-filled" size="15"></uni-icons>
										<text class="input text-color1">￥</text>
										<input class="text-input1 input text-color1" type="text" disabled
											v-model="referenceFreightNew" />
									</view>
									
								</uni-tooltip>
							</view>
						</view>
						<view class="b-view-goods-item" v-if="referenceFreightStatus">
							<view class="left site-item">
								<text class="text"></text>
								<text style="color:red">暂无此地区专线运费，请联系客服:15092939826</text>
							</view>
						</view>
						
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left site-item">
								<text class="text"></text>
								<uni-tooltip
									effect="dark" 
									placement="right-start"
									content="备注（服务项）：1、重量、体积计算费用哪个大按哪个标准计费。2、以上报价如有异形件、特大件、特重件货物类型需各加30%、20%、10%；" >
									<view class="tooltip-item">
										<text class="text1">开单费</text>
										<uni-icons custom-prefix="custom-icon" type="help-filled" size="15"></uni-icons>
										<text class="text-input1 input text-color1">￥{{referenceCreateMoney}}</text>
									</view>
								</uni-tooltip> 
							</view>
							<view class="right site-item">
								<uni-tooltip
									effect="dark" 
									placement="right-start"
									content="平台操作费：含装卸费、短驳费；按照＜300kg且＜1方，按照10元/票计费；≥300kg或≥1方，按照0.03元/kg或10元/方计费；试运营期间不扣此项费用" >
									<view class="tooltip-item">
										<text class="text1">平台操作费</text>
										<uni-icons custom-prefix="custom-icon" type="help-filled" size="15"></uni-icons>
										<text class="text-input1 input text-color1">￥{{referenceSysMoney}}</text>
									</view>
								</uni-tooltip>
							</view>
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-goods">
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text-red">*</text>
								<text class="text1">运费</text>
								<!-- <input class="uni-input input" type="text" placeholder="金额"
									:v-model="inputData.order_amount == 0 ? '' : inputData.order_amount" /> -->
								<input class="uni-input input" type="digit" placeholder="金额"
										v-model="inputData.order_amount" />
							</view>
							<view class="right">
								
								<picker 
									class="text2 text2-1" 
									style="width: 100%;" 
									@change="payPickerChange($event)" 
									:range="payFromList" 
									range-key="name">
									<view class="input-back-item">
										<input
											class="uni-input text-input3 input textInputClass" 
											type="text" disabled placeholder="付款方式"
											v-model="inputData.order_amount_pay_name" 
											placeholder-class="textPlaClass"/>
										<uni-icons custom-prefix="custom-icon" type="bottom" size="15"></uni-icons>
									</view>
								</picker>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<!-- <view class="b-view-goods-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1">付款方式</text>
							</view>
							<view class="right">
								<view :class="['text2', 'text3',{'text4':item.type==inputData.pay_from}]"
									v-for="(item,index) in payFrom" @click=" inputData.pay_from=item.type">
									{{ item.name }}
								</view>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view> -->
						<!-- <view class="b-view-goods-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1">末端配送</text>
							</view>
							<view class="right">
								<view :class="['text2', 'text3',{'text4':item.type==inputData.delivery_type}]"
									v-for="(item,index) in deliveryType" @click=" inputData.delivery_type=item.type">
									{{ item.name }}
								</view>
							</view>
						</view> -->
						<!-- <view class="b-view-goods-item item-line"></view> -->
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text"></text>
								<text class="text1">送货费</text>
								<input class="uni-input input" type="digit" placeholder="金额"
									v-model="inputData.delivery_fee" />

							</view>
							<view class="right">
									<picker
										class="text2 text2-1" 
										style="width: 100%;" 
										@change="deliveryPickerChange($event)" 
										:range="deliveryType" 
										range-key="name">
										<view class="input-back-item">
											<input
												class="uni-input text-input3 input textInputClass" 
												type="text" disabled placeholder="配送方式"
												v-model="inputData.delivery_type_name" 
												placeholder-class="textPlaClass"/>
											<uni-icons custom-prefix="custom-icon" type="bottom" size="15"></uni-icons>
										</view>
									</picker>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text"></text>
								<text class="text1">接货费</text>
								<input class="uni-input input" type="digit" placeholder="请输入"
									v-model="inputData.pickup_fee" />
							</view>
							<view class="right">
								<text class="text1">代收货款</text>
								<input class="uni-input input" type="digit" placeholder="请输入"
									v-model="inputData.advance_amount" />
							</view>
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-goods">
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1">回单收条</text>
							</view>
							<view class="right">
								<switch :checked="inputData.is_receipt == 2 ? true : false" 
										@change="switchReceiptChange" 
										color="#FFCC33" 
										style="transform:scale(0.8)" />
							</view>
						</view>
						<block v-if="inputData.is_receipt == 2">
							<view class="b-view-goods-item item-line"></view>
							<view class="b-view-goods-item">
								<view class="left">
									<text class="text" style="visibility: hidden;">*</text>
									<text class="text1" style="width: 140rpx;">回单类型</text>
								</view>
								<view class="right"> 
									<picker
										class="text2 text2-1" 
										style="width: 100%;" 
										@change="receiptPickerChange($event)" 
										:range="receiptList" 
										range-key="name">
										<view class="input-back-item">
											<input
												class="uni-input input textInputClass" 
												type="text" disabled placeholder="请选择回单类型"
												v-model="inputData.receipt_type_name" 
												placeholder-class="textPlaClass"/>
											<uni-icons custom-prefix="custom-icon" type="bottom" size="15"></uni-icons>
										</view>
									</picker>
								</view>
							</view>
							<view class="b-view-goods-item item-line"></view>
							<view class="b-view-goods-item">
								<view class="left">
									<text class="text" style="visibility: hidden;">*</text>
									<text class="text1" style="width: 140rpx;">回单数量：</text>
							
								</view>
								<view class="right">
									<input class="uni-input input textInputClass" type="number" placeholder="回单数量"
										v-model="inputData.receipt_num" />
									<text>份</text>
								</view>
							</view>
						</block>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1">异形件</text>
								<text class="text5 text6">品质路线针对异形货物存在溢价或拒单</text>
							</view>
							<view class="right">
								<!-- //is_unusual -->
								<switch @change="switchUnusualChange" color="#FFCC33" style="transform:scale(0.8)" />
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1">急件</text>
								<text class="text5 text6"></text>
							</view>
							<view class="right">
								<!-- //is_urgency -->
								<switch @change="switchUrgencyChange" color="#FFCC33" style="transform:scale(0.8)" />
							</view>
						</view>
					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-services">

						<view class="b-view-services-item">
							<view class="left">
								<text class="text" style="visibility: hidden;">*</text>
								<text class="text1 text6">备注</text>
							</view>
							<view class="right text7">
								<textarea class="textarea" v-model="inputData.remark" />
							</view>
						</view>

					</view>
				</view>
				<view class="b-view-item">
					<view class="b-view-goods">
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text1">总费用:</text>
								<text class="uni-input input text5 text6">￥{{all_order_amount}}</text>
							</view> 
							<view class="right text7">
								 <text class="text1">代收货款:</text>
								 <text class="uni-input input text5 text6">￥{{get_advance_amount}}</text>
							</view>
						</view>
						<view class="b-view-goods-item item-line"></view>
						<view class="b-view-goods-item">
							<view class="left">
								<text class="text1">现付合计</text>
								<text class="uni-input input text5 text6">￥{{now_order_amount}}</text>
							</view> 
							<view class="right text7">
								 <text class="text1">提付合计:</text>
								 <text class="uni-input input text5 text6">￥{{carry_order_amount}}</text>
							</view>
						</view>
					</view>
				</view>


				<view class="uni-list-cell-db">
					<uni-popup ref="popup" class="pop-box" type="bottom">
						<view class="popup" style="background-color: #fff;  width: 100%;">
							<view class="picker-btn">
								<view class="left" @click="close">取消</view>
								<view class="right" @click="confirm">确定</view>
							</view>
							<picker-view class="picker-view" :indicator-style="indicatorStyle" :value="selectList"
								@change="selectData">
								<picker-view-column>
									<view class="item" v-for="(item,index) in provinceList" data-kind="1" :key="index">
										{{item.name}}
									</view>
								</picker-view-column>
								<picker-view-column v-if="provinceList[selectList[0]]">
									<view class="item" v-for="(item,index) in cityList" data-kind="2" :key="index">
										{{item.name}}
									</view>
								</picker-view-column>
								<picker-view-column v-if="cityList[selectList[1]]">
									<view class="item" v-for="(item,index) in areaList" data-kind="3" :key="index">
										{{item.name}}
									</view>
								</picker-view-column>
							</picker-view>
						</view>
					</uni-popup>
				</view>
				<view class="uni-view-bottom">
					<view class="btn" @click="submitClick"><text class="text">提交</text></view>
				</view>
			</view>
		</view>
		<loading-cover ref="loadingCover"></loading-cover>
	</view>
</template>

<script>
	import delivery from './js/delivery.js';

	export default {
		components: {},
		mixins: [delivery],
		data() {
			return {

			};
		},
		methods: {
			onchange(e) {
				console.log(e, '====e')
				const value = e.detail.value
			},
			onnodeclick(node) {}
		}
	};
</script>
<style lang="scss">
	@import './css/delivery.scss';

	.pop-box {
		position: relative;
		bottom: 60rpx;
	}
</style>